@charset "UTF-8";
$ionicons-font-path: "/fonts/ionicons" !default;
$ionicons-font-family: "Ionicons" !default;
$ionicons-version: "3.0.0-alpha.3" !default;
@import "../node_modules/ionicons/dist/scss/ionicons";
@import "../node_modules/bootstrap/scss/bootstrap.scss";
@import "../node_modules/react-bootstrap-table/dist/react-bootstrap-table-all.min";
@import "nojs-menus.scss";

.lead {
  font-size: 1.4em;
}

pre {
  background-color: #333;
  border-color: #333;
  color: #eee;
  padding: 10px 20px;
  border-radius: 5px;
}

.navbar,
.navbar .btn,
.navbar .dropdown-item,
.navbar button {
  font-size: 18px;
}

.navbar {
  border-bottom: 1px solid #ddd;
}

@media (max-width: 768px) {
  .display-2 {
    font-size: 3em;
  }
  .display-3 {
    font-size: 2.5em;
  }
  .display-4 {
    font-size: 2em;
  }
}

.icon-spin {
  display: inline-block;
  animation: spin 1s infinite linear;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

/**
 * This is a fix for Reactstrap 5.0.0-alpha.4 not displaying menus in the 
 * navbar correcrtly on mobile devices.
 **/
.navbar .dropdown {
  display: block;
}

@media (max-width: 768px) {
  .navbar .dropdown-menu {
    position: relative !important;
    display: block !important;
    transform: none !important;
    padding: 0 0 10px 0;
    border: none;
  }
}

/**
 * Fix for Reactstrap
 **/
.react-bs-table-sizePerPage-dropdown .dropdown-item a {
  display: block;
  color: #000;
  text-decoration: none;
}

.react-bs-table-sizePerPage-dropdown button {
  background: #fff;
  color: #000;
}

